@charset "utf-8";
@import "variable";

#container {
  display: flex;
  flex-direction: column;
  padding-top: 0.4rem;

  .title {
    color: #333;
    text-align: center;
  }
  table.table {
    width: auto;
    min-width: 100%;
    max-width: 10000%;
    color: #333;
    margin: 0.2rem 0;

    tr {
      overflow: auto;
    }
    >thead {
      color: $header-bg;
      background-color: #f5f5f5;

      th, td {
        font-weight: bold;
        white-space: nowrap;
      }
    }
    >tbody {
      >tr:nth-of-type(odd) {
        background-color: #fcfcfc;
      }
      >tr:nth-of-type(even) {
        background-color: #f5f5f5;
      }

      th, td {
        white-space: nowrap;
      }
    }
  }
  .chart-container {
    flex: 2;

    #chart {
      width: 100%;
      height: 100%;
    }
  }
}